import React from 'react';
import { Col, Row } from 'antd';
import Link from 'next/link';
import styles from './IndexAttract.less';

const IndexAttract: React.FC = () => {
  return (
    <div className={styles.attractWrap}>
      <div className={styles.attractContent}>
        <div className={styles.title}>
          <span>连接战略</span>
          <img src="/images/index/link.png" alt="" />
          <span>运营</span>
          <img src="/images/index/link.png" alt="" />
          <span>财务</span>
        </div>
        <div className={styles.description}>
          “先胜而后战”，用面向未来的业财数据智能，有效支持运营及战略落地
        </div>
        <Row gutter={[12, 12]} justify="center">
          <Col>
            <div className={styles.tipItem}>
              <Link href="">先胜 - 新租赁准则&nbsp;&nbsp;→</Link>
              <div className={styles.tipIntro}>
                <span>租赁核算披露</span>
                <span>租赁全流程管理</span>
              </div>
            </div>
          </Col>
          <Col>
            <div className={styles.tipItem}>
              <Link href="">先胜 - 运营财务&nbsp;&nbsp;→</Link>
              <div className={styles.tipIntro}>
                <span>新店规划</span>
                <span>运营目标管理</span>
                <span>合并报表</span>
              </div>
            </div>
          </Col>
          <Col>
            <div className={styles.tipItem}>
              <Link href="">先胜 - 数据管理平台&nbsp;&nbsp;→</Link>
              <div className={styles.tipIntro}>
                <span>数据资产管理</span>
                <span>数据质量管理</span>
              </div>
            </div>
          </Col>
        </Row>
      </div>
    </div>
  );
};

export default IndexAttract;
